<%--
  Created by IntelliJ IDEA.
  User: 10330
  Date: 2021/7/12
  Time: 13:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="/pages/common/header.jsp"%>

<div class="row">

    <div class="col-md-12" style="font-weight: bold;font-size: larger">
        确认收货地址
        <hr/>
    </div>
    <div style="font-weight: normal">
        <div class="radio">
    <c:forEach items="${requestScope.get('addressList')}" var="address" varStatus="status">

        <div id="${status.index}address" class="col-md-12" style="height: 50px">
            <div class="col-md-1">
                <label>
                    <input type="radio" name="userAddressId" value="${address.addr_id}" <c:if test="${address.addr_isdefault == 1}">checked</c:if> >
                </label>
            </div>
            <div class="col-md-4">
                <div class="col-md-7">${address.addr_province}&nbsp;${address.addr_city}&nbsp;${address.addr_area}</div>
                <div class="col-md-5">${address.addr_content}</div>
            </div>
            <div class="col-md-1">${address.addr_receiver}</div>
            <div class="col-md-2">${address.addr_tel}</div>
            <div class="col-md-4">
                <div class="col-md-4">
                    <c:if test="${address.addr_isdefault == 1}">
                        默认地址
                    </c:if>
                </div>
                <div class="col-md-8">
                    <a href="#" onclick="
                            $('#myAddressModalAddressId').val('${address.addr_id}');
                            $('#myAddressModalAddressProvince').val('${address.addr_province}');
                            $('#myAddressModalAddressCity').val('${address.addr_city}');
                            $('#myAddressModalAddressArea').val('${address.addr_area}');
                            $('#myAddressModalAddressContent').val('${address.addr_content}');
                            $('#myAddressModalAddressReceiver').val('${address.addr_receiver}');
                            $('#myAddressModalAddressTel').val('${address.addr_tel}');
                            " data-toggle="modal" data-target="#myAddressModal">修改</a>
                    <a href="#" onclick="$('#addressId').val(${address.addr_id});$('#addressIndex').val(${status.index})" data-toggle="modal" data-target="#myDeleteTipsModal">删除</a>
                    <a href="${pageContext.request.contextPath}/orders?action=defaultUserDeliveryAddress&addressID=${address.addr_id}">设为默认地址</a>
                </div>
            </div>
        </div>

    </c:forEach>

        </div>
    </div>

    <button class="btn btn-primary" type="button" style="margin-left: 2%" onclick="
            $('#myAddressModalAddressId').val('');
            $('#myAddressModalAddressProvince').val('');
            $('#myAddressModalAddressCity').val('');
            $('#myAddressModalAddressArea').val('');
            $('#myAddressModalAddressContent').val('');
            $('#myAddressModalAddressReceiver').val('');
            $('#myAddressModalAddressTel').val('');
            " data-toggle="modal" data-target="#myAddressModal">添加收货地址</button>

</div>

<div class="modal fade" id="myDeleteTipsModal" tabindex="-1" role="dialog" aria-labelledby="myDeleteTipsModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myDeleteTipsModalLabel">提示</h4>
            </div>
            <div class="modal-body">
                <input id="addressIndex" type="hidden">
                <input id="addressId" type="hidden">
                确定要删除？
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="userDeliveryAddressDelete()">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="myAddressModal" role="dialog" aria-hidden="true" aria-labelledby="myAddressModalLabel">
    <form role="form" id="myAddressForm">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" aria-hidden="true" type="button" data-dismiss="modal">×</button>
                    <h4 class="modal-title" id="myAddressModalLabel" style="text-align: left">添加 / 修改收货地址</h4>
                </div>
                <div class="modal-body">

                    <div class="row">

                        <input id="myAddressModalAddressId" name="myAddressModalAddressId" type="hidden">

                        <div class="col-md-12">
                            <div class="col-md-6">
                                <div class="form-group" style="text-align: left">
                                    <label>省:<input id="myAddressModalAddressProvince" name="myAddressModalAddressProvince" type="text" class="form-control" style="font-weight: normal"></label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group" style="text-align: left">
                                    <label>市:<input id="myAddressModalAddressCity" name="myAddressModalAddressCity" type="text" class="form-control" style="font-weight: normal"></label>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-12">
                            <div class="col-md-6">
                                <div class="form-group" style="text-align: left">
                                    <label>区:<input id="myAddressModalAddressArea" name="myAddressModalAddressArea" type="text" class="form-control" style="font-weight: normal"></label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group" style="text-align: left">
                                    <label>街道:<input id="myAddressModalAddressContent" name="myAddressModalAddressContent" type="text" class="form-control" style="font-weight: normal"></label>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-12">
                            <div class="col-md-6">
                                <div class="form-group" style="text-align: left">
                                    <label>收件人:<input id="myAddressModalAddressReceiver" name="myAddressModalAddressReceiver" type="text" class="form-control" style="font-weight: normal"></label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group" style="text-align: left">
                                    <label>电话:<input id="myAddressModalAddressTel" type="text" name="myAddressModalAddressTel" class="form-control" style="font-weight: normal"></label>
                                </div>
                            </div>
                        </div>

                    </div>


                </div>
                <div class="modal-footer">

                    <button class="btn btn-primary" type="button" onclick="userDeliveryAddress()">提交</button>
                    <button class="btn btn-default" type="button" data-dismiss="modal">关闭窗口</button>

                </div>
            </div>
        </div>
    </form>
</div>


<c:if test="${sessionScope.cartGoodsList!=null}">
    <table class="table table-striped" id="cart_tab">
        <thead>
        <tr>
            <th>商品图片</th>
            <th>商品名称</th>
            <th>商品单价</th>
            <th>数量</th>
            <th>小计</th>
        </tr>
        </thead>
        <tbody id="cart_tbody">
        <c:set var="priceSum" value="${0}"/>
        <c:forEach items="${sessionScope.cartGoodsList}" var="orderDetail">
            <tr id="${orderDetail.value.goods_id}goods">
                <td><img style="height: 80px" src="${pageContext.request.contextPath}${orderDetail.value.goods_pic}"></td>
                <td>${orderDetail.value.goods_name}</td>
                <td>${orderDetail.value.goods_discount}</td>
                <td><input type="text" name="goodsSales" value="${orderDetail.value.goods_num}" size="5" readonly></td>
                <td>${orderDetail.value.goods_discount * orderDetail.value.goods_num}</td>
            </tr>
            <c:set var="priceSum" value="${priceSum + orderDetail.value.goods_discount * orderDetail.value.goods_num}"/>
        </c:forEach>
        </tbody>
    </table>
    <hr>
    <div class="col-md-12" style="text-align: right;font-weight: bold;font-size: larger">
        运费:${sessionScope.cartGoodsList.size()*12}￥
    </div>
    <br><hr>
    <div class="col-md-12" style="text-align: right;font-weight: bold;font-size: larger">
        合计(含运费):${priceSum+sessionScope.cartGoodsList.size()*12}￥
    </div>
    <br><hr><br>
</c:if>


<script>
    function userDeliveryAddress(){
        $.post("/eshop0/orders?action=addOrUpdateUserDeliveryAddress",$('#myAddressForm').serialize(),
            function (){
                window.location.href="/eshop0/orders?action=getUserDeliveryAddress";
            }
        );
    }
    function userDeliveryAddressDelete(){
        let index = $('#addressIndex').val();
        let addressId = $('#addressId').val();
        $("#"+index+"address").remove();
        $.post("/eshop0/orders?action=deleteUserDeliveryAddress",{addressID:addressId});
    }
</script>


<div style="text-align: right">
    <button class="btn btn-primary" type="button" onclick="commitOrder()">提交订单</button>
</div>

<br>

<script>
    function commitOrder(){
        let id = $('input[name="userAddressId"]:checked').val();
        if (id == null){
            alert('请选择收货地址');
        }
        else if (${sessionScope.cartGoodsList == null}){
            alert('购物车内还没有商品');
        }
        else {
            window.location.href="/eshop0/orders?action=addOrder&addressId="+id+"&priceSum=${priceSum}";
        }
    }
</script>

<%@include file="/pages/common/footer.jsp"%>
